<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2020/8/20
  Time: 15:35
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录</title>
    <link rel="stylesheet" href="static/login/css/style.css" type="text/css" media="all" />
    <link rel="stylesheet" href="static/login/css/fontawesome-all.css">
    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="static/bootstrap-4.1.3-dist/css/bootstrap.css"/>
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="static/js/jquery-2.1.0.js"></script>

    <style>



    </style>
</head>
<body>



<div>
    <div id="bg">
        <canvas></canvas>
        <canvas></canvas>
        <canvas></canvas>
    </div>
    <!-- //bg effect -->
    <!-- title -->
    <h1>考试管理系统</h1>
    <%--<div class="touxiang">
        <img src="static/imges/111.jpg"  name="pic" enctype="multipart/form-data"
             width="100px" height="100px"  id="tupian">
        <input type="file" accept="jpg" id="crowd_file">
        <button type="button" class="btn btn-success  shangchuan" for="crowd_file">上传头像</button>
    </div>--%>

    <!-- //title -->
    <!-- content -->
    <div class="sub-main-w3">
        <form id="id-From">

            <div class="form-style-agile">
                <label>
                    <i class="fas fa-user"></i>
                    手机号
                </label>
                <input id="phone-number"  placeholder="请输入手机号" name="phone" type="text">
            </div>
            <div class="form-style-agile">
                <label>
                <i class="fas fa-user"></i>
                验证码
            </label>
                <input id="mass" placeholder="发送验证码" name="massage" type="text">
            </div>

            <!-- checkbox -->

            <!-- //checkbox -->
            <button id="yanzhengma"  type="button" class="btn btn-primary btn-block" style="width:300px;height:50px">发送验证码</button>
            <button id="shouji" type="button"  class="btn btn-primary btn-block" style="width:300px;height:50px">手机登录</button>
            <span>${msg}</span>
        </form>
    </div>




</div>

</body>

<!-- Jquery -->
<script src="static/login/js/jquery-3.3.1.min.js"></script>
<!-- //Jquery -->

<!-- effect js -->
<script src="static/login/js/canva_moving_effect.js"></script>
<!-- //effect js -->
<script type="text/javascript">
    $(function (){
        $("#yanzhengma").click(function (){
            getmessage();
        })

        $("#shouji").click(function (){
            phoneLogin();
        })

    })

    function getmessage() {

        $.ajax({
            url:"/phoneLogin",
            type:"get",
            data:$("#id-From").serialize(),
            success:function (result) {
                if (result.status==200) {
                    alert(result.message)
                }else {
                    alert(result.message)
                }
            }
        })
    }
    //登录
    function phoneLogin() {
        var data={
            "massage":$("#mass").val()
        }
        $.ajax({
            url:"/phoneLogin",
            type:"post",
            data:data,
            success:function (result) {
                if (result.status==200) {
                    alert(result.message)
                    window.location.href="/user/home";
                }else {
                    alert(result.message);
                }
            }
        })
    }




</script>




</html>

